<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <jsp:include page="../inc/js.jsp"/>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>告警规则管理</title>
    <jsp:include page="../inc/css.jsp"/>
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <jsp:include page="../inc/menu.jsp"/>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Main content -->
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-12">
                    <div class="card" style="margin-top: 10px">
                        <!-- /.card-header -->
                        <div class="card-header">
                            <h4>${user.nickName} - （${user.name}） - ${device.company.name} - ${device.name}</h4>

                            <div class="form-inline">
                                <div class="form-group">
                                    <select id="searchTypeList" class="form-control" style="margin-right: 10px;margin-top: 10px;">
                                        <option value="">全部类别</option>
                                        <option value="2011">实时数据</option>
                                        <option value="2051">分钟数据</option>
                                        <option value="2061">小时数据</option>
                                        <option value="2031">日均数据</option>
                                    </select>
                                </div>
                                <div class="form-group" style="margin-top: 10px;">
                                    <button type="button" title="查询" class="btn btn-info" onclick="_alarmRuleUserList.fn.reloadData()">查询</button>
                                    <button type="button" title="返回" class="btn btn-warning" style="margin-left: 10px;" onclick="_alarmRuleUserList.fn.backList()">返回</button>
                                </div>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-striped table-bordered table-hover" id="dataTables" style="width: 99%">
                                    <colgroup>
                                        <col class="gradeA even"/>
                                        <col class="gradeA odd"/>
                                        <col class="gradeA even"/>
                                        <col class="gradeA odd"/>
                                        <col class="gradeA even"/>
                                        <col class="gradeA odd"/>
                                        <col class="gradeA even"/>
                                        <col class="gradeA odd"/>
                                        <col class="gradeA even"/>
                                        <col class="gradeA odd"/>
                                    </colgroup>
                                    <thead>
                                    <tr>
                                        <th style="max-width: 80px;">类别</th>
                                        <th>关联参数</th>
                                        <th style="max-width: 100px;">单位</th>
                                        <th style="max-width: 60px;">类型</th>
                                        <th style="max-width: 80px;">蓝线值</th>
                                        <th style="max-width: 80px;">黄线值</th>
                                        <th style="max-width: 80px;">红线值</th>
                                        <th style="max-width: 80px;">报警类别</th>
                                        <th style="max-width: 80px;">报警时间</th>
                                        <th style="max-width: 160px;">最近触发时间</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>

<input type="hidden" id="hiddenDeviceCode" value="${device.code}"/>
<input type="hidden" id="hiddenUserId" value="${user.id}"/>

<!-- page script -->
<script type="text/javascript">
    let _alarmRuleUserList = {
        v: {
            list: [],
            dTable: null,
            codeDictCode: ''
        },
        fn: {
            init: function () {
                _alarmRuleUserList.fn.dataTableInit();
            },
            backList: function () {
                window.history.go(-1);
            },
            reloadData: function () {
                _alarmRuleUserList.v.list = [];

                _alarmRuleUserList.v.dTable.DataTable().ajax.reload(null, false);
            },
            dataTableInit: function () {
                _alarmRuleUserList.v.dTable = $tutu.dataTable($('#dataTables'), {
                    "processing": true,
                    "serverSide": true,
                    "autoWidth": true,     // 自动计算宽度
                    "lengthChange": false, // 是否允许用户改变表格每页显示的记录数
                    "searching": false,
                    "ordering": false,
                    "ajax": {
                        "url": "backend/user/alarmRuleList",
                        "type": "POST",
                        "data": {
                            "deviceCode": $('#hiddenDeviceCode').val()
                        }
                    },
                    "language": $tutu.v.dataTableL,
                    "columns": [
                        {
                            "data": "type",
                            render: function (data) {
                                if (data === 2011) {
                                    return '实时预警';
                                } else if (data === 2051) {
                                    return '分钟预警';
                                } else if (data === 2061) {
                                    return '小时预警';
                                } else {
                                    return '日均预警';
                                }
                            }
                        },
                        {"data": "codeDictName"},
                        {"data": "codeDictUnit"},
                        {
                            "data": "dataType",
                            render: function (data) {
                                if (Number(data) === 1) {
                                    return '大于';
                                } else if (Number(data) === 0) {
                                    return '小于';
                                } else {
                                    return '等于';
                                }
                            }
                        },
                        {"data": "blueNum"},
                        {"data": "yellowNum"},
                        {"data": "redNum"},
                        {
                            "data": "alarmType",
                            render: function (data) {
                                return data === 1 ? '间隔报警' : '连续报警';
                            }
                        },
                        {"data": "alarmTime"},
                        {
                            "data": "lastTime",
                            render: function (data) {
                                return crtTimeFtt(data);
                            }
                        }
                    ],
                    /*添加小插件*/
                    "columnDefs": [],
                    /*展示数据格式化*/
                    "createdRow": function (row, data, index) {
                        _alarmRuleUserList.v.list.push(data);
                    },
                    /*回调函数*/
                    rowCallback: function (row, data) {

                    },
                    /*带参数*/
                    "fnServerParams": function (aoData) {
                        _alarmRuleUserList.v.list = [];

                        aoData.userId = $('#hiddenUserId').val();
                        aoData.deviceCode = $('#hiddenDeviceCode').val();
                        aoData.type = $('#searchTypeList').val();
                    },
                    "fnDrawCallback": function (data) {
                        $tutu.uiForm(data);
                    }
                });
            }
        }
    };

    $(document).ready(function () {
        _alarmRuleUserList.fn.init();

        window.onload = function () {
            checkSelectMenu("userLi");

            loadMenuColor('userLi');
        }
    });
</script>
</body>
</html>